﻿@{
    var config = ConfigurationFactory.GetConfig<UserAuthClientConfiguration>();
    var oauth2Host = config.Host;
    var watermarkUrl = this.Url.Content("~/watermark/load");
    var currentUserAction = this.Url.Content("~/desktop/currentUser");
    var userConfigView = this.Url.Content("~/desktop/entry/userConfig");
    var appsAction = this.Url.Content("~/desktop/apps");
    var menuAction = this.Url.Content("~/desktop/menu");
    var navAction = this.Url.Content("~/desktop/nav");
    var shortcutsAction = this.Url.Content("~/desktop/shortcuts");
    var createShortcutAction = this.Url.Content("~/desktop/createShortcut");
    var removeShortcutAction = this.Url.Content("~/desktop/removeShortcut");

    var widgetsAction = this.Url.Content("~/portlet/widgets");
    var widgetEditView = this.Url.Content("~/portlet/entry/edit");

    var envAction = this.Url.Content("~/platform/env");
    var moduleAction = this.Url.Content("~/platform/module");
    var messageListAction = this.Url.Content("~/sys/#/userMessage");
    var messageItemAction = this.Url.Content("~/sys/#/userMessage/Item");

    var orgQuery = this.Url.Content("~/org/query");
    var depts = this.Url.Content("~/org/depts");

    var quitAction = this.Url.Content("~/oauthagent/quit");

    var createIdAction = this.Url.Content("~/tool/createId");
    var qrcodeAction = this.Url.Content("~/tool/qrcode");
}
@section head {
    <title>MiniFox Studio</title>
    <link type="text/css" href="~/static/css/desktop.css" rel="stylesheet" />
    <link type="text/css" href="~/static/css/portlet.css" rel="stylesheet" />
    <script type="text/javascript" src="~/static/js/echarts.min.js"></script>
    <script type="text/javascript" src="~/static/js/desktop.js"></script>
    <script type="text/javascript" src="~/static/js/portlet.js"></script>
    <script type="text/javascript">
        var serviceConfig = {
            "defaults": {
                "host": {
                    "OAUTH2": "@oauth2Host",
                    "BASE": ""
                },
                "autoMsg": false,
                "timeOut": 120000,
                "enableCookies": false,
                "showProcessing": true,
                "method": "post"
            },
            "adapters": [
                {
                    "name": "desktop",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "currentUser",
                            "url": "@currentUserAction",
                            "autoMsg": true,
                            "method": "get"
                        },
                        {
                            "name": "userConfig",
                            "url": "@userConfigView",
                            "method": "get",
                            "noAjax": true
                        },
                        {
                            "name": "apps",
                            "url": "@appsAction",
                            "autoMsg": true,
                            "method": "get"
                        },
                        {
                            "name": "menu",
                            "url": "@menuAction",
                            "autoMsg": true,
                            "method": "get"
                        },
                        {
                            "name": "nav",
                            "url": "@navAction",
                            "autoMsg": true,
                            "method": "get"
                        },
                        {
                            "name": "shortcuts",
                            "url": "@shortcutsAction",
                            "autoMsg": true,
                            "method": "get"
                        },
                        {
                            "name": "createShortcut",
                            "url": "@createShortcutAction",
                            "autoMsg": true,
                            "method": "post"
                        },
                        {
                            "name": "removeShortcut",
                            "url": "@removeShortcutAction",
                            "autoMsg": true,
                            "method": "post"
                        },
                        {
                            "name": "watermark",
                            "url": "@watermarkUrl",
                            "method": "get",
                            "noAjax": true
                        }
                    ]
                },
                {
                    "name": "portal",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "widgets",
                            "url": "@widgetsAction",
                            "showProcessing": false,
                            "method": "get"
                        },
                        {
                            "name": "edit",
                            "url": "@widgetEditView",
                            "method": "get",
                            "noAjax": true
                        }
                    ]
                },
                {
                    "name": "platform",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "env",
                            "url": "@envAction",
                            "method": "get"
                        },
                        {
                            "name": "module",
                            "url": "@moduleAction",
                            "method": "get"
                        },
                        {
                            "name": "userMessage",
                            "url": "@messageListAction",
                            "method": "get",
                            "noAjax": true
                        },
                        {
                            "name": "userMessageItem",
                            "url": "@messageItemAction",
                            "method": "get",
                            "noAjax": true
                        }
                    ]
                },
                {
                    "name": "org",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "query",
                            "url": "@orgQuery",
                            "method": "get"
                        },
                        {
                            "name": "depts",
                            "url": "@depts",
                            "method": "get"
                        }
                    ]
                },
                {
                    "name": "tool",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "createId",
                            "url": "@createIdAction",
                            "method": "get"
                        }
                    ]
                },
                {
                    "name": "oauthagent",
                    "host": "BASE",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "quit",
                            "url": "@quitAction",
                            "method": "get",
                            "noAjax": true
                        }
                    ]
                },
                {
                    "name": "oauth2",
                    "host": "OAUTH2",
                    "virtualPath": "",
                    "api": [
                        {
                            "name": "changePassword",
                            "url": "/passport/entry/changepassword",
                            "method": "get",
                            "noAjax": true
                        }
                    ]
                }
            ]
        };

        $(function () {

            var service = MiniFox.createService(serviceConfig);
            var taskPool = new MiniFox.TaskPool();

            var taskItem = new MiniFox.Task("userMessages", {
                context: this,
                interval: 60000,
                delay: 500,
                once: false,
                promise: MiniFox.http,
                arguments: {
                    url: '@Url.Action("pagedquery", "data", new { name = "UserMessages" })',
                    method: "post",
                    headers: null,
                    params: null,
                    data: {
                        pageIndex: 1,
                        pageSize: 8,
                        sortFields: { receiveTime: true },
                        parameters: null
                    }
                },
                onAction: function (e) {
                    var dataSet = e.data;
                    dataSet.enterUrl = service.platform.userMessage.toString();
                    dataSet.itemUrl = service.platform.userMessageItem.toString();
                    if (dataSet.rowCount > 0) {
                        var rowCount = dataSet.rowCount >= 100 ? "99+" : dataSet.rowCount;
                        $('.new').text(rowCount);
                    }
                    else {
                        $('.new').text('');
                    }
                    var html = $('#tmpl_userMsg').tmpl(dataSet);
                    $('#nav-msg, #mini-nav-msg>ul').html(html);
                },
                onError: function (e) {

                }
            });
            taskPool.addTask(taskItem);

            service.platform.env().then(function (response) {
                if (!response.success) {
                    return;
                }
                var data = response.data;

                var desktop = new MiniFox.Desktop({
                    element: document.body,
                    currentUser: {},
                    title: data.title,
                    appDescription: data.description,
                    versionDescription: data.copyright,
                    iconUri: data.iconUri,
                    logoUri: data.logoUri,
                    theme: data.theme,
                    applicationId: data.defaultAppId,
                    homeUri: data.homeUri,
                    signOutUri: service.oauthagent.quit.toString(),
                    qrCodeModule: "",
                    profilesItems: [
                        { url: service.oauth2.changePassword.toString(), icon: "fa fa-wrench", title: "修改密码" },
                        { url: service.desktop.userConfig.toString(), icon: "fa fa-cog", title: "个性设置" },
                        // { url: service.desktop.userProfiles.toString(), icon: "fa fa-edit", title: "基本信息" },
                        { url: service.portal.edit.toString(), icon: "fa fa-home", title: "自定义门户" }
                    ],
                    components: {

                        head: {
                            element: "#head",
                            template: "#tmpl_head",
                            replaceMode: false
                        },
                        main: {
                            element: "#main",
                            components: {
                                menubar: {
                                    element: "#menu",
                                    replaceMode: true,
                                    template: "#tmpl_menubar"
                                },
                                workspace: {
                                    element: "#workspace",
                                    replaceMode: true,
                                    template: "#tmpl_workspace",
                                    tabItemTemplate: "#tmpl_workspace_tabitem",
                                    tabPageTemplate: "#tmpl_workspace_tabpage"
                                }
                            }
                        },
                        foot: {
                            element: "#foot",
                            template: "#tmpl_foot"
                        }
                    },
                    created: function () {

                        var desktop = this;
                        service.desktop.currentUser().then(function (response) {
                            if (!response.success) {
                                return;
                            }
                            desktop.currentUser = response.data;
                        });

                        service.desktop.apps().then(function (response) {
                            if (!response.success) {
                                return;
                            }
                            desktop.channels = response.data;
                        });

                        service.desktop.shortcuts().then(function (response) {
                            if (!response.success) {
                                return;
                            }
                            desktop.shortcuts = response.data;
                        });
                        desktop.getMenuData(desktop.applicationId);
                        desktop.getNavData(desktop.applicationId);

                        taskPool.allStart();
                        if (!desktop.homeUri) {
                            MiniFox.debounce(function () {
                                desktop.portlet = new MiniFox.Portlet({
                                    element: "#portlet",
                                    editMode: false,
                                    replaceMode: true,
                                    created: function () {
                                        var portlet = this;
                                        service.portal.widgets().then(function (response) {
                                            if (response.success) {
                                                response.data.forEach(function (task) {
                                                    portlet.createWidget({
                                                        id: task.id,
                                                        name: task.name,
                                                        title: task.title,
                                                        icon: task.icon,
                                                        colSpan: task.colSpan,
                                                        rowSpan: task.rowSpan,
                                                        className: task.className,
                                                        enterUrl: task.enterUrl,
                                                        showHeader: task.showHeader,
                                                        showFooter: task.showFooter,
                                                        template: "#tmpl_widget",
                                                        schedule: task.schedule ? { delay: task.schedule.delay, once: task.schedule.once, interval: task.schedule.interval } : null,
                                                        dataSource: task.dataSource ? {
                                                            url: task.dataSource.url,
                                                            method: task.dataSource.method,
                                                            headers: task.dataSource.headers,
                                                            params: task.dataSource.params,
                                                            data: task.dataSource.data
                                                        } : null,
                                                        dataTemplate: task.template
                                                    });
                                                });
                                            }
                                        });
                                    }
                                });
                            }, 500)();
                        }
                    },
                    getMenuData: function (id) {
                        var desktop = this;
                        desktop.menuItems = [];
                        return service.desktop.menu({ params: { appId: id } }).then(function (response) {
                            if (!response.success) {
                                return;
                            }
                            desktop.menuItems = response.data[0] ? response.data[0].children : [];
                        });
                    },
                    getNavData: function (id) {
                        var desktop = this;
                        desktop.navItems = [];
                        return service.desktop.nav({ params: { appId: id } }).then(function (response) {
                            if (!response.success) {
                                return;
                            }
                            desktop.navItems = response.data[0] ? response.data[0].children : [];
                        });
                    }

                });

            });

            service.desktop.watermark.params["_"] = Math.random();
            var uri = service.desktop.watermark.toString();
            $('.watermark').css('background-image', `url(${uri.toString()})`);
        });

    </script>
    <script id="tmpl_userMsg" type="text/x-jquery-tmpl">
        {{if result.rows.length > 0}}
        <li><a><span class="title">你有<b>${rowCount}</b>条未读消息</span></a></li>
        <li class="divider"></li>
        {{each result.rows}}
        <li>
            <a href="#" data-url="${itemUrl + " ?messageId=" + dataItem.messageId}" data-icon="fa fa-envelope" data-target="module" title="${dataItem.title}">
                <span class="title">${dataItem.title}</span>
            </a>
        </li>
        {{/each}}
        <li class="divider"></li>
        <li><a href="#" data-url="${enterUrl}" data-target="module" data-icon="fa fa-envelope" title="我的消息"> 查看更多 <i class="pull-right glyphicon glyphicon-menu-right"></i></a></li>
        {{else}}
        <li><a><span class="title">暂时没有任何新消息</span></a></li>
        <li><a href="#" data-url="${enterUrl}" data-target="module" data-icon="fa fa-envelope" title="我的消息"> 查看历史消息 <i class="pull-right glyphicon glyphicon-menu-right"></i></a></li>
        {{/if}}

    </script>
    <script id="tmpl_head" type="text/x-jquery-tmpl">
        <div class="logobar">
            <a href="#" data-target="menubar" data-toggle="slide" class="togglebar menubar-toggle"><span class="glyphicon ${$data.fixedMenu?'glyphicon-align-justify':'glyphicon-list'}"></span></a>
            <a class="navbar-brand"><img src="${$data.logoUri}" alt="" /></a>
        </div>
        <div class="navbar">
            <div class="nav-channel">
                <ul class="nav navbar-nav">
                    {{each channels}}
                    {{if appId == applicationId}}
                    <li><a href="#" class="actived" data-target="channel" data-val="${appId}"><i class="${icon}"></i> ${appName}</a></li>
                    {{else}}
                    <li><a href="#" data-target="channel" data-val="${appId}"><i class="${icon}"></i> ${appName}</a></li>
                    {{/if}}
                    {{/each}}
                    <li class="more">
                        <a href="#"><i class="glyphicon glyphicon-option-horizontal"></i></a>
                        <ul class="dropdown-menu"></ul>
                    </li>
                </ul>
            </div>
            <div class="nav-task">
                <ul class="nav navbar-nav navbar-right">
                    <li>
                        <a href="#" id="btn_toDoMsg" data-target="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <span class="badge new"></span>
                            <span class="fa fa-envelope"></span>
                        </a>
                        <ul id="nav-msg" class="dropdown-menu nav-msg" role="menu" aria-labelledby="btn_toDoMsg">
                        </ul>
                    </li>
                    <li>
                        <a href="#" id="btnUser" data-target="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <span class="fa fa-user"></span>
                            <span>[${$data.currentUser?$data.currentUser.signName:""}]${$data.currentUser?$data.currentUser.displayName:""}</span>
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="btnUser">
                            {{if $data.qrCodeModule}}
                            <li><a href="#"><img src="${$data.qrCodeModule}" alt="" /></a></li>
                            <li class="divider"></li>
                            {{else}}
                            {{/if}}
                            {{each $data.profilesItems}}
                            <li><a href="#" data-url="${url}" data-target="module" data-icon="${icon}" title="${title}"><i class="${icon}"></i> ${title}</a></li>
                            {{/each}}
                            <li class="divider"></li>
                            <li><a href="${$data.signOutUri}"><i class="fa fa-power-off"></i> 退出系统</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
        <div class="navbar minibar">
            <div class="pull-right">
                <a href="#" class="togglebar navbar-toggle" data-target="#mini-nav-channel">
                    <span class="fa fa-cogs"></span>
                </a>
                <a href="#" class="togglebar navbar-toggle" data-target="#mini-nav-msg">
                    <span class="badge new"></span>
                    <span class="fa fa-envelope"></span>
                </a>
                <a href="#" class="togglebar navbar-toggle" data-target="#mini-nav-profiles">
                    <span class="fa fa-user"></span>
                </a>
            </div>
        </div>
        <div class="mini-navbar">
            <div id="mini-nav-channel" class="nav-channel navbar-collapse">
                <ul class="nav navbar-nav">
                    {{each channels}}
                    {{if appId == applicationId}}
                    <li><a href="#" class="actived" data-target="channel" data-val="${appId}"><i class="${icon}"></i> ${appName}</a></li>
                    {{else}}
                    <li><a href="#" data-target="channel" data-val="${appId}"><i class="${icon}"></i> ${appName}</a></li>
                    {{/if}}
                    {{/each}}
                </ul>
            </div>
            <div id="mini-nav-msg" class="navbar-collapse">
                <ul class="nav navbar-nav nav-msg">
                </ul>
            </div>
            <div id="mini-nav-profiles" class="nav-profiles navbar-collapse">
                <ul class="nav navbar-nav">

                    {{if $data.qrCodeModule}}
                    <li><a href="#"><img src="${$data.qrCodeModule}" alt="" /></a></li>
                    {{else}}
                    {{/if}}
                    {{each $data.profilesItems}}
                    <li><a href="${url}" data-target="module" data-icon="${icon}" title="${title}"><i class="${icon}"></i> ${title}</a></li>
                    {{/each}}
                    <li><a href="${$data.signOutUri}"><i class="fa fa-power-off"></i> 退出系统</a></li>
                </ul>
            </div>
        </div>
    </script>
    <script id="tmpl_menubar" type="text/x-jquery-tmpl">
        <div id="menu" class="container-fluid dock-panel ${$data.fixedMenu?'fixed':'popup'}" style="width:${$data.fixedMenu?$data.fixedWidth:$data.popupWidth}px">
            <div class="menubar">
                <ul class="nav nav-list menu">
                    <li><a href="#home" style="padding-left: 10px;"><i class="menu-icon fa fa-home" style="width:20px; font-size:18px;"></i><span class="menu-title">首页</span></a></li>
                    {{each menuItems}}
                    <li>
                        {{tmpl({item:$value, level:1}) '#tmpl_menuItem'}}
                    </li>
                    {{/each}}
                </ul>
            </div>
        </div>
    </script>
    <script id="tmpl_menuItem" type="text/x-jquery-tmpl">
        {{if item.data.navType == 'Group'}}
        {{tmpl({item: $data.item, level: $data.level}) '#tmpl_menuFolder'}}
        {{else}}
        {{tmpl({item: $data.item, level: $data.level}) '#tmpl_menuModule'}}
        {{/if}}
    </script>
    <script id="tmpl_menuFolder" type="text/x-jquery-tmpl">
        <a href="#" data-target="folder" data-icon="${item.data.icon}" title="${item.data.name}" style="padding-left: ${$data.level * 10}px;">
            <i class="menu-icon ${item.data.icon}"></i>
            <span class="menu-title">${item.data.name}</span>
            {{if item.data.label != null}}
            <span class="label menu-label">${item.data.label}</span>
            {{/if}}
            {{if item.children && item.children.length > 0}}
            <i class="pull-right fa fa-angle-right"></i>
            {{/if}}
        </a>
        {{if item.children && item.children.length > 0}}
        <ul class="nav nav-list sub">
            {{each item.children}}
            <li>{{tmpl({item:$value, level: $data.level + 1}) '#tmpl_menuItem'}}</li>
            {{/each}}
        </ul>
        {{/if}}
    </script>
    <script id="tmpl_menuModule" type="text/x-jquery-tmpl">
        <a href="#" data-val="${item.id}" data-url="${item.data.url}" data-target="module" data-open="${item.data.openMode}" data-icon="${item.data.icon}" title="${item.data.name}" style="padding-left: ${$data.level * 10}px;">
            <i class="menu-icon ${item.data.icon}"></i>
            <span class="menu-title">${item.data.name}</span>
            {{if item.data.label != null}}
            <span class="label menu-label">${item.data.label}</span>
            {{/if}}
        </a>
    </script>
    <script id="tmpl_workspace" type="text/x-jquery-tmpl">
        <div id="workspace" class="container-fluid workspace">
            <div class="tabs-container">
                <div class="home pull-left">
                    <a href="#home"><i class="fa fa-home"></i></a>
                </div>

                <div class="tabitems-wrap">
                    <ul class="nav nav-tabs"></ul>
                </div>

                <div class="tabs-scroller">
                    <ul class="nav navbar-nav navbar-right nav-tabs-scroller">
                        <li><a data-target="tabScrollLeft" href="#"><span class="fa fa-caret-left"></span></a></li>
                        <li><a data-target="tabScrollRight" href="#"><span class="fa fa-caret-right"></span></a></li>
                        <li>
                            <a href="#" class="enabled" id="tabcloser" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="fa fa-cog"></span></a>
                            <ul class="dropdown-menu" role="menu" aria-labelledby="tabcloser">
                                <li><a href="#" data-target="closeOthers">关闭其它</a></li>
                                <li><a href="#" data-target="clearTab">关闭所有</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="tabpages-container">
                <div class="content home current">
                    {{if $data.homeUri}}
                    <iframe id="home" frameborder="0" src="${$data.homeUri}"></iframe>
                    {{else}}
                    <div id="portlet" class="container-fluid portlet"></div>
                    {{/if}}
                </div>
            </div>
        </div>
    </script>
    <script id="tmpl_workspace_tabitem" type="text/x-jquery-tmpl">
        <li page-url="${url}" role="presentation">
            <a href="#">
                <span class="fa fa-circle-o-notch fa-spin"></span>
                <span class="title">${title}</span>
                <i class="fa fa-times-circle remove"></i>
            </a>
        </li>
    </script>
    <script id="tmpl_workspace_tabpage" type="text/x-jquery-tmpl">
        <div page-url="${url}" class="content">
            <iframe frameborder="0" src="${url}"></iframe>
        </div>
    </script>
    <template id="tmpl_foot">
        <span class="pull-left">${appDescription}</span>
        <span class="pull-right">${versionDescription}</span>
    </template>
    <template id="tmpl_widget">
        <div class="widget col-sm-${colSpan} row-${rowSpan}">
            <div class="panel ${className}">
                {{if showHeader}}
                <div class="panel-heading">
                    <h3 class="panel-title"><i class="${icon}"></i> ${title}</h3>
                </div>
                {{/if}}
                <div id="${name}" class="panel-body data-content">
                </div>
                {{if showFooter}}
                <div class="panel-footer">
                    <a class="more" href="#" data-url="${enterUrl}" data-icon="${icon}" title="${title}">
                        查看更多
                    </a>
                </div>
                {{/if}}

            </div>

            {{if editMode}}
            <div class="editMode">
                <div class="tool">
                    <div class="pull-right">
                        <a href="#">
                            <i class="glyphicon glyphicon-cog"></i>
                        </a>
                        <a href="#">
                            <i class="glyphicon glyphicon-remove"></i>
                        </a>
                    </div>
                </div>
            </div>
            {{/if}}

        </div>
    </template>

}



<div id="head" class="navbar navbar-inverse navbar-static-top head" role="navigation">
</div>

<div class="container-fluid main" id="main">
    <div id="menu">
    </div>

    <div id="workspace">
    </div>
</div>

<div id="foot" class="navbar navbar-inverse foot">
</div>
<div class="watermark"></div>